﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="wfVehicleList2.aspx.cs" Inherits="msBsc.WebUi.wMall.Public.wfVehicleList" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>地接客车辆信息，包车旅游专家，旅游因您而定</title>
    <meta name="keywords" content="地接客，旅游，车辆检索，旅游包车" />
    <link href="/themes/wStyle1/css/sLayout.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/sHead.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/sFoot.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/pagination.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/Public/sVehicleList.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/Chat/layim.css" rel="stylesheet" />
</head>
<body>
    <div class="wf_all">
        <input type="hidden" id="countryId" />
        <input type="hidden" id="cityId" />
        <input type="hidden" id="destionId" />
        <input type="hidden" id="vehicleType" value="0" />
        <input type="hidden" id="vehicleBrand" value="0" />
        <input type="hidden" id="minVehiclePrice" />
        <input type="hidden" id="maxVehiclePrice" />
        <input type="hidden" id="minVehicleSeat" />
        <input type="hidden" id="maxVehicleSeat" value="0" />
        <input type="hidden" id="serviceTypeId" value="0" />
        <input type="hidden" id="pageIndex" value="0" />
        <div id="divLoginInfo">
            <%=msBsc.WebUi.Code.QtHtmlGet.GetHeaderLoginInfo() %>
        </div>
        <div id="main-content">
            <div class="contentInfo">
                <div class="nav-collapse collapse">
                    <ul class="breadcrumb searchLable">
                        <li>
                            <a href="/wp_Index.htm">首页</a>
                            <span class="divider"></span>
                        </li>
                        <li class="areaSelect">
                            <a href="#"><span id="topAreaValue" class="areaName" data-value=""></span><i class="selectList"></i></a>
                            <span class="divider "></span>
                            <ul class="m-p" id="topArea">
                            </ul>
                        </li>
                        <li class="areaSelect">
                            <a href="#"><span id="secendAreaValue" class="areaName" data-value=""></span><i class="selectList"></i></a>
                            <span class="divider"></span>
                            <ul class="m-p" id="secendArea">
                            </ul>
                        </li>
                        <li class="areaSelect" id="">
                            <a href="#"><span id="areaValue" class="areaName" data-value=""></span><i class="selectList"></i></a>
                            <span class="divider last"></span>
                            <ul class="m-p" id="area">
                            </ul>
                        </li>
                    </ul>

                    <div class="searchLable">
                        <div class="divTitle"><span class="searchTitle">车型</span></div>
                        <div class="divCondition" id="carType">
                        </div>
                    </div>
                    <div class="searchLable">
                        <div class="divTitle"><span class="searchTitle">品牌</span></div>
                        <div class="divCondition" id="carBrand">
                        </div>
                    </div>
                    <div class="searchLable">
                        <div class="divTitle"><span class="searchTitle">价格</span></div>
                        <div class="divCondition" id="carPrice">
                            <span class="searchCondition"><span class="checkCondition" min-value="0" max-value="0">不限</span></span>
                            <span class="searchCondition">
                                <span min-value="0" max-value="100">￥100以下</span></span>
                            <span class="searchCondition">
                                <span min-value="100" max-value="300">￥100-￥300</span></span>
                            <span class="searchCondition">
                                <span min-value="300" max-value="600">￥300-￥600</span></span>
                            <span class="searchCondition">
                                <span min-value="600" max-value="900">￥600-￥900</span></span>
                            <span class="searchCondition">
                                <span min-value="900" max-value="1200">￥900-￥1200</span></span>
                            <span class="searchCondition">
                                <span min-value="1200" max-value="1200">￥1200以上</span></span>
                        </div>
                    </div>
                    <div class="searchLable">
                        <div class="divTitle"><span class="searchTitle">座位</span></div>
                        <div class="divCondition" id="carSeat">
                            <span class="searchCondition">
                                <span class="" min-value="0" max-value="0">不限</span></span>
                            <span class="searchCondition">
                                <span min-value="2" max-value="2">2座</span></span>
                            <span class="searchCondition">
                                <span min-value="5" max-value="5">5座</span></span>
                            <span class="searchCondition">
                                <span min-value="7" max-value="7">7座</span></span>
                            <span class="searchCondition">
                                <span min-value="8" max-value="11">8-11座</span></span>
                            <span class="searchCondition">
                                <span min-value="12" max-value="19">12-19座</span></span>
                            <span class="searchCondition">
                                <span min-value="20" max-value="35">20-35座</span></span>
                            <span class="searchCondition">
                                <span min-value="35" max-value="35">35座以上</span></span>
                        </div>
                    </div>
                    <div class="searchLable">
                        <div class="divMaxTitle"><span class="searchTitle">服务类型</span></div>
                        <div class="divMaxCondition" id="serviceType">
                            <span class="searchCondition">
                                <span class="checkCondition" data-value="0">不限</span></span>
                            <span class="searchCondition">
                                <span data-value="1">司机兼导游</span></span>
                            <span class="searchCondition">
                                <span data-value="2">司机兼向导</span></span>
                            <span class="searchCondition">
                                <span data-value="3">专职司机+专业导游</span></span>
                        </div>
                    </div>
                </div>
                <table class="searchInfo">
                    <tbody id="carList">
                    </tbody>
                </table>
                <xmp id="svc_list_temp_vehicle" style="display: none">
                            {{#for(var i=0,len=d.rows.length;i < len;i++){ }}
                                <tr class='searchContent'><td class='carImg'><img src='{{d.rows[i].VEHICLE_DEFAULT_PIC}} 268x200img.jpg'/></td><td class='carContent'><div class='carDetailed'><a target='_blank' href='/wp_VehicleInfo.htm?vehicleId={{d.rows[i].VEHICLE_INFO_ID}}'><div class='carName'><div>{{d.rows[i].VEHICLE_NAME}}</div></div><div class='carType'><span>{{d.rows[i].VEHICLE_BRAND_NAME}}</span> | <span>{{d.rows[i].VEHICLE_SEATS}} 座</span></div><div class='carServer'>
                                    <span>服务类型：</span><span>{{d.rows[i].VEHICLE_SERVICE_TYPE_NAME}}</span></div>
                                    <div class='carIntroduction'>{{getIntroLenght(d.rows[i].VEHICLE_INTRO) }}</div></a></div></td><td class='carMoney'>
                                        <div><span class="priceType">￥</span><span class='priceNumber'>{{getNumber(d.rows[i].VEHICLE_PRICE_DAY)}}</span><span class='priceUnit'> 起/天</span></div><div class="btnBuy"><a target="_blank" href="/wb_AddOrder.htm?carid={{d.rows[i].VEHICLE_INFO_ID}}">立即订购</a></div></td><td class='carUser'><div class='userInfo'><div class='userImg'><img src='{{d.rows[i].CUSTOMER_DEFAULT_PIC}} 77x77img.jpg' /></div><a  target='_blank' href='/wp_DjackVehicle.htm?djackId={{d.rows[i].DJACK_ID}}'>{{d.rows[i].CUSTOMER_NICK}}</a></div></td></tr>
                                
            {{#} }}
                           </xmp>

                <div class="jpage" id="divPage"></div>
            </div>
        </div>


        <!--start JS引用-->
        
        <script src="/themes/wStyle1/js/Chat/lib.js"></script>
        <script src="/themes/wStyle1/js/Chat/layim.js"></script>
        <script src="/jqPlugin/js/jquery-1.8.3.min.js"></script>
        <script src="/jqPlugin/layer/layer.min.js" type="text/javascript"></script>
        <script src="/jqPlugin/js/jBase.js"></script>
        <script src="/jqPlugin/js/jBPage.js"></script>
        <script src="/jqPlugin/js/laytpl.js"></script>
        <script src="/jqPlugin/layer/extend/layer.ext.js"></script>
        <script src="/themes/wStyle1/js/comm/jsPagination.js"></script>
        <script src="/themes/wStyle1/js/comm/VerifyJs.js"></script>
        <!--end JS引用-->
       

        <script type="text/ecmascript">
            (function () {
                setUrl();
                bindConditionsClick();
                $(".areaSelect").mouseover(function () {
                    $(this).prev("li").children(".divider").addClass("fl");
                    $(this).children("a").addClass("a");
                    $(this).children(".divider").addClass("sl");
                    $(this).children(".last").show();
                    $(this).find(".m-p").show();
                });
                $(".areaSelect").mouseout(function () {
                    $(this).prev("li").children(".divider").removeClass("fl");
                    $(this).children("a").removeClass("a");
                    $(this).children(".divider").removeClass("sl");
                    $(this).children(".last").hide();
                    $(this).find(".m-p").hide();
                });
                $(".m-p li").live("click", function () {
                    var parent = $(this).parent(".m-p");
                    parent.hide();
                    if (parent.attr("id") == "topArea") {
                        if ($(this).attr("data-value") == $("#countryId").val()) {
                            return;
                        }
                        $("#countryId").val($(this).attr("data-value"));
                        $("#pageIndex").val(1);
                        btnDo("checkCountry");
                    }
                    if (parent.attr("id") == "secendArea") {
                        if ($(this).attr("data-value") == $("#cityId").val()) {
                            return;
                        }
                        $("#cityId").val($(this).attr("data-value"));
                        $("#destionId").val($("#areaValue").attr("data-value"));
                        $("#pageIndex").val(1);
                        refreshPage();
                    }
                    if (parent.attr("id") == "area") {
                        //$("#countryId").val($("#topAreaValue").attr("data-value"));
                        //$("#cityId").val($("#secendAreaValue").attr("data-value"));
                        if ($(this).attr("data-value") == $("#destionId").val()) {
                            return;
                        }
                        $("#destionId").val($(this).attr("data-value"));
                        $("#pageIndex").val(1);
                        refreshPage();
                    }
                });
                $(".userInfo img").live("click", function () {
                    window.open($(this).parents(".userInfo").children("a").attr("href"));
                });
                $(".carImg img").live("click", function () {
                    window.open($(this).parents(".carImg").siblings(".carContent").children(".carDetailed").children("a").attr("href"));
                });
            })();




            //写入url参数到hidden标签
            function setUrl() {

                var countryId = GetQueryStr("countryId");
                var cityId = GetQueryStr("cityId");
                var destionId = GetQueryStr("destionId");
                var vehicleType = GetQueryStr("vehicleType");
                var vehicleBrand = GetQueryStr("vehicleBrand");
                var minVehiclePrice = GetQueryStr("minVehiclePrice");
                var maxVehiclePrice = GetQueryStr("maxVehiclePrice");
                var minVehicleSeat = GetQueryStr("minVehicleSeat");
                var maxVehicleSeat = GetQueryStr("maxVehicleSeat");
                var serviceType = GetQueryStr("serviceType");
                var pIndex = GetQueryStr("pIndex");
                if (IsNull(countryId) || IsNull(cityId)) {
                    countryId = "DF6723BE-A25C-4F77-BB49-A1662D3E6F2A";
                    cityId = "AEF39D8E-D298-4AF1-AEC5-2B00D237F5F5";
                    destionId = "";
                }
                if (IsNull(vehicleType) || isNaN(vehicleType)) {
                    vehicleType = 0;
                }
                if (IsNull(vehicleBrand) || isNaN(vehicleBrand)) {
                    vehicleBrand = 0;
                }
                if (IsNull(minVehiclePrice) || isNaN(minVehiclePrice)) {

                    minVehiclePrice = 0;
                }
                if (IsNull(maxVehiclePrice) || isNaN(maxVehiclePrice)) {
                    maxVehiclePrice = 0;
                }
                $("#carPrice .searchCondition span").removeClass("checkCondition");
                $("#carPrice .searchCondition span[min-value='" + minVehiclePrice + "'][max-value='" + maxVehiclePrice + "']").addClass("checkCondition");
                if (IsNull(minVehicleSeat) || isNaN(minVehicleSeat)) {
                    minVehicleSeat = 0;
                }
                if (IsNull(maxVehicleSeat) || isNaN(maxVehicleSeat)) {
                    maxVehicleSeat = 0;
                }
                $("#carSeat .searchCondition span").removeClass("checkCondition");
                $("#carSeat .searchCondition span[min-value='" + minVehicleSeat + "'][max-value='" + maxVehicleSeat + "']").addClass("checkCondition");
                if (IsNull(serviceType) || isNaN(serviceType)) {
                    serviceType = 0;
                }
                $("#serviceType .searchCondition span").removeClass("checkCondition");
                $("#serviceType .searchCondition span[data-value='" + serviceType + "']").addClass("checkCondition");
                if (IsNull(pIndex) || isNaN(pIndex)) {
                    pIndex = 1;
                }
                $("#countryId").val(countryId);
                $("#cityId").val(cityId);
                $("#destionId").val(destionId);
                $("#vehicleType").val(vehicleType);
                $("#vehicleBrand").val(vehicleBrand);
                $("#minVehiclePrice").val(minVehiclePrice);
                $("#maxVehiclePrice").val(maxVehiclePrice);
                $("#minVehicleSeat").val(minVehicleSeat);
                $("#maxVehicleSeat").val(maxVehicleSeat);
                $("#serviceTypeId").val(serviceType);
                $("#pageIndex").val(pIndex);
            }

            //绑定条件点击事件
            function bindConditionsClick() {
                $("#carType .searchCondition span").live("click", function () {
                    if ($(this).attr("class") == "checkCondition") {
                        return;
                    };
                    $("#vehicleType").val($(this).attr("data-value"));
                    $("#pageIndex").val(1);
                    refreshPage();
                });
                $("#carBrand .searchCondition span").live("click", function () {
                    if ($(this).attr("class") == "checkCondition") {
                        return;
                    };
                    $("#vehicleBrand").val($(this).attr("data-value"));
                    $("#pageIndex").val(1);
                    refreshPage();
                });
                $("#carPrice .searchCondition span").live("click", function () {
                    if ($(this).attr("class") == "checkCondition") {
                        return;
                    };
                    $("#minVehiclePrice").val($(this).attr("min-value"));
                    $("#maxVehiclePrice").val($(this).attr("max-value"));
                    $("#pageIndex").val(1);
                    refreshPage();
                });
                $("#carSeat .searchCondition span").live("click", function () {
                    if ($(this).attr("class") == "checkCondition") {
                        return;
                    };
                    $("#minVehicleSeat").val($(this).attr("min-value"));
                    $("#maxVehicleSeat").val($(this).attr("max-value"));
                    $("#pageIndex").val(1);
                    refreshPage();
                });
                $("#serviceType .searchCondition span").live("click", function () {
                    if ($(this).attr("class") == "checkCondition") {
                        return;
                    };
                    $("#serviceTypeId").val($(this).attr("data-value"));
                    $("#pageIndex").val(1);
                    refreshPage();
                });
            }

            function goPage(index) {
                $("#pageIndex").val(index);
                refreshPage();
            }

            function selectArea(inputId, data, checkId) {
                var htm = "";
                var isCheck = false;
                for (var i = 0; i < data.length; i++) {
                    if (checkId == data[i].ID) {
                        isCheck = true;
                        $("#" + inputId).siblings("a").find(".areaName").text(data[i].Name);
                        $("#" + inputId).siblings("a").find(".areaName").attr("data-value", data[i].ID);
                    }
                    htm += "<li data-value='" + data[i].ID + "'>" + data[i].Name + "</li>";
                }
                if (!isCheck) {
                    $("#" + inputId).siblings("a").find(".areaName").text(data[0].Name);
                    $("#" + inputId).siblings("a").find(".areaName").attr("data-value", data[0].ID);
                }
                $("#" + inputId).html(htm);
            }

            //写入车辆类型
            function setVehicleType(data) {
                var typeId = $("#vehicleType").val();
                $("#carType").html("");
                if (IsNull(typeId) || typeId == 0) {
                    $("#carType").html("<span class='searchCondition'><span class='checkCondition' data-value='0' id='brand'>不限</span></span>");
                } else {
                    $("#carType").html("<span class='searchCondition'><span class='' data-value='0' id='brand'>不限</span></span>");
                }
                $.each(data.rows, function (index, carType) {
                    if (carType.enum_Value == typeId) {
                        $("#carType").append("<span class='searchCondition'><span class='checkCondition' data-value='" + carType.enum_Value + "'>" + carType.enum_Name + "</span></span>");
                    } else {
                        $("#carType").append("<span class='searchCondition'><span data-value='" + carType.enum_Value + "'>" + carType.enum_Name + "</span></span>");
                    }
                });
            }


            //写入车辆品牌
            function setVehicleBrand(data) {
                var brandId = $("#vehicleBrand").val();
                $("#carBrand").html("");
                if (IsNull(brandId) || brandId == 0) {
                    $("#carBrand").html("<span class='searchCondition'><span class='checkCondition' data-value='0' id='brand'>不限</span></span>");
                } else {
                    $("#carBrand").html("<span class='searchCondition'><span class='' data-value='0' id='brand'>不限</span></span>");
                }
                $.each(data.rows, function (index, vehicleBrand) {
                    if (vehicleBrand.enum_Value == brandId) {
                        $("#carBrand").append("<span class='searchCondition'><span class='checkCondition' data-value='" + vehicleBrand.enum_Value + "'>" + vehicleBrand.enum_Name + "</span></span>");
                    } else {
                        $("#carBrand").append("<span class='searchCondition'><span data-value='" + vehicleBrand.enum_Value + "'>" + vehicleBrand.enum_Name + "</span></span>");
                    }
                });
            }

            function refreshPage() {
                var countryId = $("#countryId").val();
                var cityId = $("#cityId").val();
                var destionId = $("#destionId").val();
                var vehicleType = $("#vehicleType").val();
                var vehicleBrand = $("#vehicleBrand").val();
                var minVehiclePrice = $("#minVehiclePrice").val();
                var maxVehiclePrice = $("#maxVehiclePrice").val();
                var minVehicleSeat = $("#minVehicleSeat").val();
                var maxVehicleSeat = $("#maxVehicleSeat").val();
                var serviceType = $("#serviceTypeId").val();
                var pIndex = $("#pageIndex").val();

                window.location.href = "/wp_VehicleList.htm?countryId=" + countryId + "&cityId=" + cityId + "&destionId=" + destionId + "&vehicleType=" + vehicleType + "&vehicleBrand=" + vehicleBrand + "&minVehiclePrice=" + minVehiclePrice + "&maxVehiclePrice=" + maxVehiclePrice + "&minVehicleSeat=" + minVehicleSeat + "&maxVehicleSeat=" + maxVehicleSeat + "&serviceType=" + serviceType + "&pIndex=" + pIndex;
            }

            var parentsId = "00000000-0000-0000-0000-000000000000";

            function btnDo(sEbtn) {
                GtGrid1Action = sEbtn;
                var opart = new jsonRow();
                if (GtGrid1Action == "initplace") {
                    var opart = GetGtParam("true");
                    opart.AddCell("checkThree", "");
                    ajaxComm(opart);
                } else if (GtGrid1Action == "checkCountry") {
                    opart.AddCell("ACTION", GtGrid1Action);
                    opart.AddCell("countryId", $("#countryId").val());
                    ajaxComm(opart);
                }

            };

            //执行AJAX调用时获取参数
            function GetGtParam(isAll) {
                var _jsParam = new jsonRow();
                _jsParam.AddCell("parentsId", parentsId);
                _jsParam.AddCell("countryId", $("#countryId").val());
                _jsParam.AddCell("cityId", $("#cityId").val());
                _jsParam.AddCell("destionId", $("#destionId").val());
                _jsParam.AddCell("vehicleType", $("#vehicleType").val());
                _jsParam.AddCell("checkBrand", $("#vehicleBrand").val());
                _jsParam.AddCell("minVehiclePrice", $("#minVehiclePrice").val());
                _jsParam.AddCell("maxVehiclePrice", $("#maxVehiclePrice").val());
                _jsParam.AddCell("minVehicleSeat", $("#minVehicleSeat").val());
                _jsParam.AddCell("maxVehicleSeat", $("#maxVehicleSeat").val());
                _jsParam.AddCell("serviceType", $("#serviceTypeId").val());
                _jsParam.AddCell("pageRows", "10");
                _jsParam.AddCell("pIndex", $("#pageIndex").val());
                _jsParam.AddCell("isAll", isAll);
                _jsParam.AddCell("ACTION", GtGrid1Action);
                return _jsParam;
            };

            btnDo("initplace");

            function getIntroLenght(intro) {
                return intro.length > 80 ? intro.substring(0, 77) + "......" : intro
            }
        </script>
        <script src="/themes/wStyle1/js/Chat/chatMessage.js"></script>
        <%=msBsc.WebUi.Code.QtHtmlGet.GetFloorHtml() %>
    </div>

</body>
</html>
